<!DOCTYPE html>
<html lang="en">
	<head>
		<meta charset="UTF-8">
		<title>登录</title>
		<link rel="stylesheet" href="style/css/font_login.css">
		<meta name="viewport" content="width=device-width, initial-scale=1.0">
	</head>
	<body>
		<div id="app">
			<div id="login">
				<div id="bgd">
					<canvas id='myCanvas' :width='width' :height='height'>
					</canvas>
				</div>
				<div id="loginBox">
					<div style="display: flex;justify-content: space-between;">
						<h4 style="cursor: pointer;" @click="to_show_login">登录</h4>
						<h5 style="cursor: pointer;" @click="to_show_register"> 去注册 > </h5>
					</div>
					<el-form :model="loginForm" :rules="loginRules" ref="loginForm" label-width="0px" v-show="show_login">
						<el-form-item label="" prop="studentId" style="margin-top:40px;">
							<el-row>
								<el-col :span='2'>
									<i class="el-icon-user"></i>
								</el-col>
								<el-col :span='22'>
									<el-input class="inps" placeholder='学号' v-model="loginForm.studentId"></el-input>
								</el-col>
							</el-row>
						</el-form-item>
						<el-form-item label="" prop="passWord" style="margin-top:40px;">
							<el-row>
								<el-col :span='2'>
									<i class="el-icon-lock"></i>
								</el-col>
								<el-col :span='22'>
									<el-input placeholder="身份证后六位" v-model="loginForm.password" show-password class="inps">
									</el-input>
								</el-col>
							</el-row>
						</el-form-item>
						<el-form-item style="margin-top:55px;">
							<el-button type="primary" round class="submitBtn" :loading="loading"
								@click="submitForm('loginForm')">登录</el-button>
						</el-form-item>
					</el-form>
					<el-form :model="registerForm" :rules="registerRules" ref="registerForm" label-width="0px" v-show="show_register">
						<el-form-item label="" prop="username" style="margin-top:5px;">
							<el-row>
								<el-col :span='2'>
									<i class="el-icon-user"></i>
								</el-col>
								<el-col :span='22'>
									<el-input class="inps" placeholder='姓名' v-model="registerForm.username"></el-input>
								</el-col>
							</el-row>
						</el-form-item>
						<el-form-item label="" prop="studentId" style="margin-top:5px;">
							<el-row>
								<el-col :span='2'>
									<i class="el-icon-user"></i>
								</el-col>
								<el-col :span='22'>
									<el-input class="inps" placeholder='学号' v-model="registerForm.studentId"></el-input>
								</el-col>
							</el-row>
						</el-form-item>
						<el-form-item label="" prop="passWord" style="margin-top:5px;">
							<el-row>
								<el-col :span='2'>
									<i class="el-icon-user"></i>
								</el-col>
								<el-col :span='22'>
									<el-input class="inps" placeholder='身份证后六位' v-model="registerForm.passWord"></el-input>
								</el-col>
							</el-row>
						</el-form-item>
						<el-form-item label="" prop="phone" style="margin-top:5px;">
							<el-row>
								<el-col :span='2'>
									<i class="el-icon-user"></i>
								</el-col>
								<el-col :span='22'>
									<el-input class="inps" placeholder='手机号' v-model="registerForm.phone"></el-input>
								</el-col>
							</el-row>
						</el-form-item>
						<el-form-item label="" prop="qq" style="margin-top:5px;">
							<el-row>
								<el-col :span='2'>
									<i class="el-icon-user"></i>
								</el-col>
								<el-col :span='22'>
										<el-input class="inps" placeholder='QQ号' v-model="registerForm.qq"></el-input>
								</el-col>
							</el-row>
						</el-form-item>
						<el-form-item style="margin-top:20px;">
							<el-button type="primary" round class="submitBtn" :loading="loading"
									   @click="toRegisterForm('registerForm')">登录</el-button>
						</el-form-item>
					</el-form>
				</div>
			</div>
		</div>
	</body>

	<!-- 引入vue -->
	<script type="text/javascript" src="./style/js/vue.js"></script>
	<script type="text/javascript" src="./style/js/vue-resource.min.js"></script>

	<!-- 引入ElementUI -->
	<script type="text/javascript" src="./style/ElementUI/index.js"></script>
	<link rel="stylesheet" type="text/css" href="./style/ElementUI/index.css" />

	<script type="text/javascript" src="./style/js/font_login.js"></script>

</html>
